<template>
  <div class="opportunity">
    <div class="naviga">&nbsp;&nbsp;&nbsp;&nbsp;{{$store.state.marketName}}&nbsp;>市场宏观趋势</div>
    <div class='details' >
      <div class='details-bar clearfix col-xs-12'>
        <span class='col-xs-1' style='padding: 0;line-height: 40px'>宏观趋势</span>

        <p
          class='col-xs-1 first-botton anylsis-bot1'
        >
          <router-link
             style="color:#fff;text-decoration:none"
             :to="{path:'/full/marketMenu/targetMarketTrends/opportunityDetails/macroInfo'}"
          >
            机会威胁&nbsp;&nbsp;&rsaquo;
          </router-link>

        </p>
         <p
            class='col-xs-1 first-botton anylsis-bot2'
            @click="centerSourceVisible = true;clearPort()"
          >
           信息源上报
        </p>

      </div>
    </div>
    <div class="table" style="display: flex;width: 97.65%;margin:auto;height: 100%;flex-direction: column;border: 1px solid #e1e1e1">
      <!--按钮start-->
      <div  style="margin: 20px 20px;width: 100%">
        <p
          style="width:15%;height: 40px;margin-right: 10px;border-radius:5px"
          class="botton1"
          @click="getThreat(item,index)"
          v-for="(item,index) in fieldData">
          {{item}}
        </p>
        <p
          class='col-xs-1 xz'
          @click="centerDrulesVisible = true;clearXZ()"
        >
          +添加细则
        </p>

      </div>
      <!--按钮end-->
      <el-table
        :data="list"
        border
        :row-class-name="tableRowClassName"
        :header-cell-style="{background:'#eff6fc'}"
        style="width: 100%; margin-top: 20px;">
        <el-table-column
          prop="articles"
          label="细则">
        </el-table-column>
        <el-table-column
          prop="content"
          width=600
          label="具体内容">
          <template slot-scope="scope">
            <div>
              <p v-if="!scope.row.show">{{scope.row.content}}</p>
              <el-input v-model="scope.row.content" v-else></el-input>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="adopt"
          label="信息状态">
          <template slot-scope="scope">
            <div  :style="{'color':(scope.row.adopt? '#46d27a':'#ec6075')}">{{getState(scope.row)}}</div>
          </template>
        </el-table-column>
        <el-table-column
          prop="informationType"
          label="信息源">
        </el-table-column>
        <el-table-column
          prop="productCode"
          label="是否采纳">
          <template slot-scope="scope">
            <div style="display: flex;justify-content: space-around">
              <el-checkbox v-model="scope.row.adopt" :true-label="1" :false-label="0"  style="width: 20px;height: 20px" @change="adoptChange(scope.row)"></el-checkbox>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <div style="display: flex;justify-content: space-around" v-if="scope.row.informationType=='自定义'">

              <span style="color: #3aaaec" @click="aditorShow(scope.row)">{{scope.row.show ? '确定':'编辑'}}</span>
              <span style="color: #3aaaec" @click="delThreat(scope.row)">删除</span>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
   <!--分页start-->
    <div class="page-warp">
      <div class="paging">
      <span class="first-page"
            style="cursor: pointer"
            @click="change(1)"
      >首页</span>
        <el-pagination
          layout="prev, pager, next"
          prev-text='上一页'
          next-text='下一页'
          background
          @current-change="change"
          :current-page="page"
          :total="totalPage">
        </el-pagination>
      </div>
    </div>
    <!--分页end-->
    <!--弹框细则start-->
    <div class="pop-up-drules">
      <el-dialog
        title="添加PEST"
        :visible.sync="centerDrulesVisible"
        width="60%"
        @open="openPest"
        center>
        <div class="pop-cont-drules ">
          <ul class="col-xs-12">
            <span class="col-xs-1"><span style="color:red;font-size:14px;">*</span>趋势</span>
            <p class="col-xs-2">
              <el-select v-model="trendValue" placeholder="请选择" @change="xZValue='',content=''">
                <el-option
                  v-for="item,index in fieldData"
                  :key="index"
                  :label="item"
                  :value="item">
                </el-option>
              </el-select>
            </p>
          </ul>
          <ul class="col-xs-12">
            <span class="col-xs-1"><span style="color:red;font-size:14px;">*</span>细则</span>
            <p class="col-xs-2">
              <el-select :disabled="content!=''"  v-model="xZValue" placeholder="其他"  @change="content=''">
                <el-option
                  v-for="item,index in getThreat2"
                  :key="index"
                  :label="item"
                  :value="item">
                </el-option>
              </el-select>
            </p>
            <p class="col-xs-5">
              <el-input
                maxlength=16
                :disabled="xZValue!=''"
                v-model="content"
                placeholder="请输入自定义细则"
                style="margin-left: 20px">
              </el-input>
            </p>
          </ul>
          <ul class="clearfix col-xs-12" style="padding: 0;">
            <span class="col-xs-1" style="padding: 0;line-height: 60px"><span style="color:red;font-size:14px;">*</span>信息内容</span>
            <li class="col-xs-11 area " style="list-style: none;height: 120px">
              <el-input
                maxlength=160
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                style="height:100%"
                v-model="analyseRusult">
              </el-input>
            </li>
          </ul>
          <ul class="col-xs-12">
            <span class="col-xs-1"><span style="color:red;font-size:14px;">*</span>来源</span>
            <p class="col-xs-2">
              <el-select v-model="source" placeholder="全部" @change="changeSource(source)">
                <el-option
                  v-for="item,index in sourceOption"
                  :key="index"
                  :label="item.label"
                  :disabled="item.disabled"
                  :value="item.value">
                </el-option>
              </el-select>
            </p>
            <p class="col-xs-5" v-if="source=='网页'"><el-input v-model="sourceInput" placeholder="请输入内容" style="margin-left: 20px"></el-input></p>
            <!-- <p class="col-xs-5" v-else-if="source=='文件'">123</p> -->
             <el-upload
                  v-else-if="source=='文件'"
                  class="upload-demo col-xs-5"
                  :action="uploadUrl"
                  :data="uploadConfig"
                  name="file"
                  :multiple="false"
                  :beforeUpload="beforeAvatarUpload"
                  :on-success='success'
                  :limit=1
                  :on-remove='remove'
                >
                  <el-button size="small" type="text" style='line-height:40px;padding-left:20px'>文件导入<span style="color:red;padding-left:5px">(*仅能导入单个文件)</span></el-button>
                </el-upload>
          </ul>
        </div>

        <span slot="footer" class="dialog-footer">
           <el-button type="primary" @click="addXZ()" style="width: 100px;height: 40px;margin: 70px 0 20px 0">确 定</el-button>
           <el-button @click="cancelXZ()"  style="width: 100px;height: 40px;margin: 70px 0 20px 0">取 消</el-button>
        </span>

      </el-dialog>
    </div>
    <!--弹框细则end-->
    <!--弹框信息源上报start-->
    <div class="pop-up-source">
      <el-dialog
        title="添加上报"
        :visible.sync="centerSourceVisible"
        width="60%"
        style="border-radius: 10px"
        :befor-close='beforClose'
        center>
        <div class="pop-cont-source ">
          <ul class="col-xs-12">
            <span class="col-xs-1">信息关键词</span>
            <div class="col-xs-11 area">
              <el-input
                length=60
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                style="height: 120px"
                v-model="keyword">
              </el-input>
            </div>
          </ul>
          <ul class="col-xs-12">
            <span class="col-xs-1">来源</span>
            <div class="col-xs-11">
              <el-input v-model="souInput" placeholder="请输入内容"></el-input>
            </div>
          </ul>
        </div>
        <span slot="footer" class="dialog-footer">
           <el-button type="primary" @click="sourceReport()" style="width: 100px;height: 40px;margin: 200px 0 20px 0">确 定</el-button>
            <el-button @click="cancelReport()"  style="width: 100px;height: 40px;margin: 200px 0 20px 0">取 消</el-button>
        </span>
      </el-dialog>
    </div>
    <!--弹框信息源上报end-->
  </div>
</template>
<script>
export default {
  data() {
    return {
      uploadUrl: "/file/uploadFile",
      uploadConfig: {
        //method: 'File_ImportEmployee',
        type: "Document"
      },
      fileList: [],
      list: [],
      marketId: "",
      fieldData: "",
      checked: true,
      nochecked: false,
      analyseRusult: "",
      content: "",
      input1: "",
      sourceOption: [
        {
          value: "网页",
          label: "网页"
        },
        {
          value: "文件",
          label: "文件"
          //disabled: true
        }
      ],
      source: "",
      value: "",
      textarea: "",
      centerDrulesVisible: false,
      centerSourceVisible: false,
      textarea1: "",
      trendValue: "",
      xZValue: "",
      getThreat2: [],
      sourceInput: "",
      input: "",
      sourceShow: false,
      keyword: "",
      souInput: "",
      fieldValue: "",
      page: 1,
      totalPage: 1,
      WXValue: "",
      WXIndex: "",
      sourceUpdate: "",
      fieldUrl: "",
    };
  },

  mounted() {
    this.$store.commit("isMarket", true);
    this.marketId = this.$store.state.id;
    this.getField();
    // this.$store.commit("setId", this.marketId);
    // let itemData = this.$route.query.data;
    // this.$store.commit("setMarket", itemData);
    // this.$store.commit('setShow', true)
    //获取市场下的品牌

    this.getmarkData(this.$store.state.itemData.market.id);
  },
  methods: {
    cancelXZ() {
      this.centerDrulesVisible = false;
    },
    success(res) {
      this.fieldUrl = res.fileUrl;
      if (res.code == 200) {
        this.$message({
          message: "上传成功",
          type: "success"
        });
        this.sourceUpdate = res.fileUrl;
      } else if (res.code == 300) {
        this.$message({
          message: "未知错误",
          type: "error"
        });
        this.sourceUpdate = "";
      }
    },
    beforeAvatarUpload(file) {
      console.log(file);
      var testmsg = file.name.substring(file.name.lastIndexOf(".") + 1);
      const extension = testmsg === "doc";
      const extension2 = testmsg === "docx";
      const extension3 = testmsg === "txt";
      const isLt2M = file.size / 1024 / 1024 < 5;
      console.log(file.size / 1024 / 1024);
      console.log(isLt2M);
      if (!extension && !extension2 && !extension3) {
        this.$message({
          message: "上传文件只能是 doc、docx、txt格式!",
          type: "error"
        });
      }
      if (!isLt2M) {
        this.$message({
          message: "上传文件大小不能超过 5MB!",
          type: "error"
        });
      }
      return (extension || extension2 || extension3) && isLt2M;
    },
    remove() {
      this.sourceUpdate = "";
    },
    change(e) {
      console.log(e);
      this.page = e;
      console.log(this.WXValue);
      this.getThreat(this.WXValue);
    },
    //打开细则弹框清楚上次填写的内容
    clearXZ() {
      this.trendValue = "";
      this.xZValue = "";
      this.content = "";
      this.analyseRusult = "";
      this.source = "";
      this.sourceInput = "";
    },
    //打开信息源上报弹框清除上次填写的内容
    clearPort() {
      this.keyword = "";
      this.souInput = "";
    },
    //查询市场关联竞品-品牌接口
    getmarkData(id) {
      console.log(id);
      this.erMarkId = id;
      this.$http
        .post(this.GLOBAL.host, {
          method: "getMarketProduct",
          query: {
            marketId: id
          }
        })
        .then(res => {
          if (res.data.code == 200) {
            this.tableData = res.data.data;
            let arr = [];
            for (let i in res.data.data) {
              arr.push({
                brand: res.data.data[i].brand,
                code: res.data.data[i].productCode
              });
            }
            console.log(arr);
            this.$store.commit("setBrandArr", arr);
          }
        })
        .catch(error => {});
    },
    aditorShow(row) {
      let list = this.list;
      let isE = false;
      // row.show=row.show==true ? false :true
      if (row.show == false) {
        for (let i in list) {
          isE = isE + list[i].show;
        }
        console.log(isE);
        if (isE > 0) {
          return;
        }
        row.show = true;
        //请求！点击确定，修改市场
      } else {
        row.show = false;
        this.updateThreat(row);
      }
      console.log(row);
    },
    //修改
    updateThreat(row) {
      row = JSON.parse(JSON.stringify(row));
      delete row.show;
      this.$http
        .post(this.GLOBAL.host, {
          method: "updateOpportunityThreat",
          data: row
        })
        .then(res => {
          if (res.data.code == 200) {
            this.$message({
              message: "修改成功",
              type: "success"
            });
          } else {
            this.$message({
              message: "修改失败",
              type: "error"
            });
          }
        })
        .catch(error => {});
    },
    //删除机会接口
    delThreat(row) {
      this.$http
        .post(this.GLOBAL.host, {
          method: "delOpportunityThreat",
          data: {
            id: row.id
          }
        })
        .then(res => {
          if (res.data.code == 200) {
            this.$message({
              message: "删除成功",
              type: "success"
            });
            //如果删除成功刷新页面
            //this.getField();
            let index1;
            this.fieldData.map((item, index) => {
              if (item == row.trend) {
                index1 = index;
              }
            });
            this.getThreat(row.trend, index1);
          } else {
            this.$message({
              message: "删除失败",
              type: "error"
            });
          }
        })
        .catch(error => {});
    },
    adoptChange(row) {
      console.log(row);
      this.$http
        .post(this.GLOBAL.host, {
          method: "adoptOpportunityThreat",
          data: {
            marketId: this.marketId,
            id: row.id,
            publicOpportunityId: row.publicOpportunityId,
            adopt: row.adopt
          }
        })
        .then(res => {
          if (res.data.code != 200) {
            row.adopt = 0;
          } else if (res.data.code == 200) {
            this.getThreat(this.WXValue);
          }
        })
        .catch(error => {});
    },
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2 === 0) {
        return "success-row";
      } else {
        return "warning-row";
      }
      return "";
    },
    // change(e){
    //   console.log(e)
    //   this.page=e;
    //   this.getThreat()
    // },
    //选择信息源
    changeSource(e) {
      console.log(e);
      if (e == "网页") {
        this.sourceShow = true;
      } else if (e == "文件") {
        this.sourceShow = false;
      }
    },

    //信息状态
    getState(row) {
      console.log(row);
      return row.adopt == 1 ? "采纳" : "未采纳";
    },
    //公共和市场机会威胁获取
    getThreat(val, index) {
      console.log(val);
      this.WXValue = val;
      this.WXIndex = index;
      $(".botton1")
        .eq(index)
        .addClass("active1")
        .siblings()
        .removeClass("active1");
      this.marketId = this.$store.state.id;
      this.$http
        .post(this.GLOBAL.host, {
          method: "getAllOpportunityThreat",
          query: {
            marketId: this.$store.state.id, //this.marketId
            trend: val,
            pageNo: this.page,
            pageSize: 10
            //政治/经济参数
          }
        })
        .then(res => {
          console.log(res);
          // this.totalPage=res.data.data.total
          let datas = res.data.data.list;
          for (let i in datas) {
            datas[i].show = false;
          }
          this.list = datas;
          this.totalPage = res.data.data.total;
        })
        .catch(error => {});
    },
    //根据市场id查市场机会类型
    getField() {
      this.$http
        .post(
          this.GLOBAL.host,
          {
            method: "getDictionary",
            query: {
              cnName: "市场罗盘_宏观趋势"
            }
          }

          // {
          //   method: "getFieldOfOpportunityThreat",
          //   query: {
          //     marketId: this.marketId, //this.marketId
          //     opportunityType: "机会",
          //     field: "trend"
          //   }
          // }
        )
        .then(res => {
          console.log(res.data.data.dictionary);
          let data = res.data.data.dictionary;
          let arr = [];
          for (let i in data) {
            arr.push(data[i].entry);
          }
          console.log(arr);
          this.fieldData = arr;
          console.log(this.fieldData);
          let fieldFirst = this.fieldData[0];
          this.fieldValue = fieldFirst;
          this.$nextTick(function() {
            $(".botton1")
              .eq(0)
              .addClass("active1");
          });
          this.getThreat(fieldFirst, 0);
        })
        .catch(error => {});
    },
    //添加细则-自定义市场机会接口
    addXZ() {
      var strRegex =
        "(https|http|ftp|rtsp|mms)://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]";
      var ymReg = new RegExp(strRegex);
      //var str1=/(.+(?=[;|,\；|，|.]$))/
      var str1=/[;；,， ]/
      if (this.trendValue.length === 0) {
        this.$message({
          message: "趋势不能为空",
          type: "warning"
        });
        return;
      } else if (this.xZValue.length === 0 && this.content.length === 0) {
        this.$message({
          message: "细则不能为空",
          type: "warning"
        });
        return;
      } else if (this.analyseRusult.length === 0) {
        this.$message({
          message: "信息内容不能为空",
          type: "warning"
        });
        return;
      } else if (this.source.length === 0) {
        this.$message({
          message: "来源不能为空",
          type: "warning"
        });
        return;
      } else if (this.source == "网页" && this.sourceInput == "") {
        this.$message({
          message: "网址不能为空",
          type: "warning"
        });
        return;
      } else if (this.source == "文件" && this.sourceUpdate == "") {
        this.$message({
          message: "导入文件不能为空",
          type: "warning"
        });
        return;
      } else if (this.sourceInput && !ymReg.test(this.sourceInput)) {
        this.$message({
          message: "网址内容请输入如：http://www.baidu.com",
          type: "warning"
        });
        return;
      }else if(str1.test(this.sourceInput)){
        this.$message({
          message: "仅能输入一个网址",
          type: "warning"
        });
        return;
      } else {
        this.$http
          .post(this.GLOBAL.host, {
            method: "addOpportunityThreat",
            data: {
              marketId: this.marketId,
              opportunityType: "测试1",
              trend: this.trendValue,
              articles: this.xZValue == "" ? this.content : this.xZValue,
              content: this.analyseRusult,
              creator: this.$store.state.user.id,
              informationUrl:
                this.source == "网页" ? this.sourceInput : this.sourceUpdate,
              informationSourceType: this.source
            }
          })
          .then(res => {
            if (res.data.code == 200) {
              this.$message({
                message: "添加细则成功",
                type: "success"
              });
              this.centerDrulesVisible = false;
              let index1;
              this.fieldData.map((item, index) => {
                if (item == this.trendValue) {
                  index1 = index;
                }
              });
              this.getThreat(this.trendValue, index1);
            } else {
              this.$message({
                message: "添加失败",
                type: "error"
              });
            }
          })
          .catch(error => {});
      }
    },
    //弹框细则下拉框
    getThreatXZ(val, callback) {
      console.log(val);
      this.marketId = this.$store.state.id;
      this.$http
        .post(this.GLOBAL.host, {
          method: "getFieldOfOpportunityThreat",
          query: {
            marketId: this.$store.state.id,
            trend: val,
            field: "articles"
          }
        })
        .then(res => {
          console.log(res);
          callback(res.data.data);
        })
        .catch(error => {});
    },
    //信息源上报
    sourceReport() {
      let ymReg = /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/;
      if (this.keyword.length === 0) {
        this.$message({
          message: "信息关键词不能为空",
          type: "warning"
        });
        return;
      } else if (this.souInput.length === 0) {
        this.$message({
          message: "来源不能为空",
          type: "warning"
        });
        return;
      } else if (!ymReg.test(this.souInput)) {
        this.$message({
          message: "来源请输入网址如:http://www.baidu.com",
          type: "warning"
        });
        return;
      } else {
        this.$http
          .post(this.GLOBAL.host, {
            method: "addInformationSource",
            data: {
              informationKeyWords: this.keyword,
              informationUrl: this.souInput
            }
          })
          .then(res => {
            if (res.data.code == 200) {
              this.$message({
                message: "信息源成功上报",
                type: "success"
              });
              this.centerSourceVisible = false;
              this.keyword = "";
              this.souInput = "";
            } else {
              this.$message({
                message: "上报失败",
                type: "error"
              });
            }
          })
          .catch(error => {});
      }
    },
    cancelReport() {
      this.centerSourceVisible = false;
      this.keyword = "";
      this.souInput = "";
    },
    beforClose() {
      this.centerSourceVisible = false;
      this.keyword = "";
      this.souInput = "";
    },
    openPest() {}
  },

  watch: {
    trendValue(e) {
      console.log(e);
      this.getThreatXZ(e, data => {
        console.log(data);
        this.getThreat2 = data;
      });
    },
    WXValue(newValue, oldValue) {
      console.log(newValue, oldValue);
      if (newValue !== oldValue) {
        this.page = 1;
        this.getThreat(newValue);
        console.log(567890);
      }
    },
  },
  computed: {}
};
</script>
<style lang="less" scoped>
.opportunity {
  * {
    margin: 0;
    padding: 0;
    font-size: 14px;
  }
  .first-botton {
    float: right;
    line-height: 40px;
    text-align: center;
    color: #fff;
    cursor: pointer;
  }
  .anylsis-bot1 {
    background: linear-gradient(to right, #3bc9e2, #08acf2);
    border-radius: 5px;
  }
  .anylsis-bot2 {
    background: #acc6d3;
    border-radius: 5px;
    margin-right: 10px;
  }
  .xz {
    float: right;
    margin: 0 30px;
    height: 40px;
    background: #e6dfdf;
    line-height: 40px;
    text-align: center;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    cursor: pointer;
  }
  .area {
    .el-textarea {
      .el-textarea__inner {
        height: 100%;
      }
    }
  }
  .details {
    width: 100%;
    height: auto;
    background: #f6f6f6;
    li {
      list-style: none;
    }
    > .details-bar {
      padding: 20px 20px;
    }
  }
  .bg {
    background: #eff6fc;
  }
  .row {
    display: flex;
    position: relative;
    border-bottom: 1px solid #e1e1e1;
  }
  .row div {
    height: auto;
    width: 125px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .row ul {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
  }
  .row li:last-child {
    border: none;
  }
  .row li {
    height: 40px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #e1e1e1;
    width: 100%;
  }
  .row li span {
    display: block;
    width: 160px;
    text-align: center;
    height: 100%;
    border-left: 1px solid #e1e1e1;
    flex: 1;
    line-height: 40px;
  }
  .row li span img {
    width: 16px;
    height: 16px;
  }
  .row li span:nth-child(2) {
    flex: 5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
  }
  .row li span:nth-child(5) {
    flex: 2;
  }
}
</style>
<style lang="less">
.opportunity {
  .el-upload__input {
    display: none;
  }
  .botton1 {
    font-size: 14px;
    text-align: center;
    line-height: 40px;
    height: 40px;
    border: 1px solid #ccc;
    float: left;
    cursor: pointer;
  }
  .active1 {
    color: #fff;
    background: #3aaaec;
  }
  /*细则弹框start*/
  .pop-up-drules {
    border-radius: 20px;
    height: 300px;
    .el-dialog__header {
      text-align: center;
      padding: 20px 20px 10px;
      span {
        font-size: 18px;
      }
    }
    .el-dialog__body {
      padding-top: 0;
      height: 400px !important;
    }
    .el-dialog {
      border-radius: 10px;
      margin: auto;
      margin-top: 15vh;
    }
    textarea {
      height: 100% !important;
    }
    .pop-cont-drules {
      ul {
        padding: 0;
        margin-top: 20px;
        > p:nth-child(1) {
          color: #3aaaec;
        }
      }
    }
    .ck {
      margin-top: 26px;
    }
  }
  /*细则弹框end*/
  /*信息源上报弹框start*/
  .pop-up-source {
    border-radius: 20px;
    .el-dialog__header {
      text-align: center;
      padding: 20px 20px 10px;
      span {
        font-size: 18px;
      }
    }
    .el-dialog__body {
      padding-top: 0;
    }
    .el-dialog {
      border-radius: 10px !important;
      margin: auto;
    }
    textarea {
      height: 100% !important;
    }
    .pop-cont-source {
      textarea {
        height: 100% !important;
      }
      ul {
        padding: 0;
        margin-top: 20px;
        > p:nth-child(1) {
          color: #3aaaec;
        }
      }
    }
    .ck {
      margin-top: 26px;
    }
  }
  .el-table {
    margin-top: 0 !important;
    text-align: center;
  }
  .el-table .warning-row {
    background: #eff6fc;
  }

  .el-table .success-row {
    background: #ffffff;
  }
  .cell {
    text-align: center;
  }
  /*信息源上报弹框end*/
  /*分页样式start*/
  .page-warp {
    position: relative;
    height: 40px;
    > h2 {
      position: absolute;
      left: 20px;
      line-height: 40px;
    }
    > .paging {
      position: absolute;
      float: right;
      right: 20px;
      color: #676767;
      display: flex;
      margin-top: 5px;
      .first-page {
        position: absolute;
        width: 53px;
        height: 32px;
        background: #fff;
        border: 1px solid #ebebeb;
        font-size: 14px;
        text-align: center;
        line-height: 32px;
      }
      .el-pagination {
        padding: 0 0 0 53px;
        height: 32px;
        line-height: 32px;
        border-top: 1px solid #ebebeb;
        border-bottom: 1px solid #ebebeb;
      }
      .el-pager {
        background: #fff;
        height: 28px;
        li {
          padding: 0;
          border-right: 1px solid #ebebeb;
          background: #fff;
          margin: 0;
        }
      }
      .btn-prev {
        border-right: 1px solid #ebebeb;
        color: #676767;
        background: #fff;
        margin: 0;
        padding: 0 5px;
      }
      .btn-next {
        border-right: 1px solid #ebebeb;
        color: #676767;
        background: #fff;
        margin: 0;
        padding: 0 5px;
      }
    }
  }

  /*分页样式end*/
}
</style>
